﻿<div id="data-grid-demo">
    <p>Click this text and press <b>Tab</b></p>
    @(Html.DevExtreme().DataGrid<DevExtreme.NETCore.Demos.Models.DataGrid.EmployeeByState>()
        .ID("gridContainer")
        .ShowBorders(true)
        .Editing(editing => {
            editing.AllowUpdating(true);
            editing.AllowDeleting(true);
            editing.SelectTextOnEditStart(true);
            editing.UseIcons(true);
        })
        .HeaderFilter(headerFilter => headerFilter.Visible(true))
        .FilterPanel(filterPanel => filterPanel.Visible(true))
        .FilterRow(filterRow => filterRow.Visible(true))
        .Paging(paging => {
            paging.Enabled(true);
            paging.PageSize(10);
        })
        .Pager(pager => {
            pager.Visible(true);
            pager.AllowedPageSizes(new[] {5, 10});
            pager.ShowPageSizeSelector(true);
            pager.ShowNavigationButtons(true);
        })
        .FocusedRowEnabled(true)
        .Columns(columns => {
            columns.AddFor(m => m.FirstName);
            columns.AddFor(m => m.LastName);
            columns.AddFor(m => m.Position);
            columns.AddFor(m => m.StateID)
                .Lookup(lookup => lookup
                    .DataSource(d => d.Mvc().Controller("DataGridStatesLookup").LoadAction("Get").Key("ID"))
                    .DisplayExpr("Name")
                    .ValueExpr("ID")
                );
        })
        .DataSource(d => d.Mvc()
            .Controller("DataGridEmployees")
            .LoadAction("Get")
            .Key("ID")
        )
    )
</div>
